<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        window.onload = function(){
            console.log("dom加载结束之后执行");
            var ele = document.querySelector(".box");
            console.log(ele);
        }
        console.log(111);
        //  var ele = document.querySelector(".box");
        //  console.log(ele);
        // ele.onclick = function(){}
    </script>
</head>
<body>
    <div class="box">1111</div>
    <script>
        
        // 1. html 标签 的简写形式  ：  document.documentElement

        // 普通的写法 
        // var htmlEle = document.querySelector("html");
        // console.log(htmlEle);
        // 简写形式 
        // console.log( document.documentElement);

        // 2. head 标签 :document.head

        // 普通的写法 ： 

        // var headEle = document.querySelector("head");
        // console.log(headEle);

        // 简写 ：
        // console.log( document.head);

        // 3.body标签 ： document.body 

        // 普通写法 ： 
            // var bodyEle = document.querySelector("body");
            // console.log(bodyEle);
        // 简写形式 
        // console.log(document.body);

        // 4.获取title标签里的内容
        // 获取 title标签里的文本 ；  可以设置 title标签里的文本
        // var titleEle = document.querySelector("title");
        // console.log(titleEle);
        // titleEle.innerText = "修改了";
        // console.log( document.title);

        // document.title = "标题";
        // var num = 0;
        // setInterval(function(){
        //     // console.log(111);
        //     num++;
        //     document.title = num;
        // }, 1000);




    </script>
</body>
</html>